<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String bathPath = request.getContextPath();
	pageContext.setAttribute("bathPath", bathPath);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta charset="utf-8">
  <title>人员资料设置</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <script type="text/javascript" src="${bathPath}/js/jquery-1.9.1.min.js" ></script>
  <link rel="stylesheet" href="${bathPath}/frame/layui/css/layui.css"  media="all">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>

<style type="text/css"> 
.layui-table-cell .layui-form-checkbox[lay-skin="primary"]{
     top: 50%;
     transform: translateY(-50%);
}
</style>
<body>
<div class="layui-tab" lay-filter="demo" lay-allowclose="true" style="height:450px; width:730px;margin-top:-20px; ">
  <!-- <ul class="layui-tab-title">
    <li lay-id="22">人员信息查询</li>
  </ul> -->
  <div class="layui-tab-content" style="height:450px; width:730px;">
    <div class="layui-tab-item layui-show" >
  <form id="myform" class="layui-form layui-form-pane">
  <%-- <input type="hidden" id="depid" name="depid" value="${u.depid}" /> --%>
 <div class="demoTable" style="margin-top: 20px;margin-left:25px;"> 
</div> 
</form>   
 <table class="layui-hide"  id="demo"></table>
<table class="layui-hide"  id="test"  lay-filter="test"></table>
<script src="${bathPath}/frame/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 --> 
<script type="text/html" id="barDemo">
  <div class="layui-btn-container">
	<button class="layui-btn layui-btn-xs" lay-event="upd">修改</button>
	<button class="layui-btn layui-btn-xs" lay-event="del">删除</button>
  </div>
</script>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <a class="layui-btn layui-btn-sm" onclick="addtab()" >增加人员</a>
  </div>
</script>

<script>
	layui.use('element', function() {
		var $ = layui.jquery, element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
		$('.site-demo-active').on('click', function() {
			var othis = $(this), type = othis.data('type');
			active[type] ? active[type].call(this, othis) : '';
		});

		//Hash地址的定位
		var layid = location.hash.replace(/^#test=/, '');
		element.tabChange('test', layid);

		element.on('tab(test)', function(elem) {
			location.hash = 'test=' + $(this).attr('lay-id');
		});

	});
	//删除方法
	function delete1(d){
		layer.confirm("确定删除么？", {btn: ['确定', '取消'], title: "提示"}, function(){
			$.ajax({
			 type:"POST",
			 async:true,
		     url:"${bathPath}/aDKUserInfo/deleteUserInfo.action?autoid="+d,
		     success:function(msg){
		         layer.msg(msg);
		         location.reload();
		     }
		 });
		});
	}
	//修改
	function upd(d){
		top.layer.open({
			  title:'修改',
			  type: 2,
			  area:['990px', '570px'],
			  offset: ['150px','300px'] ,
			  content: '${bathPath}/aDKUserInfo/findId.action?autoid='+d,
			  success: function(layero, index) {
			        layer.iframeAuto(index);

			    }
			}); 
	}
	//增加部门弹出框
	function addtab(){
		top.layer.open({
			  title:'增加人员',
			  type: 2,
			  area:['990px', '570px'],
			  offset: ['150px','300px'] ,
			  content: '${bathPath}/aDKUserInfo/findId.action'
			}); 
	}
	</script>

<script>

//表格事件
layui.use('table', function(){
 //var parm = $('#myform').serialize(); //获取表单所有数据
  var table = layui.table;
  var layTableId="test";
  var flag=0; //判断表格是否在增加数据

//返回data数据给表格
 var laydata="";
//监听行工具栏事件
	table.on('tool(test)', function(obj){
		var data = obj.data //获得当前行数据
	    ,layEvent = obj.event; //获得 lay-event 对应的值
	  if(layEvent === 'upd'){
		upd(data.autoid);
	    } 
	 if(layEvent === 'del'){
		delete1(data.autoid);
	    } 
});
//监听排序
  table.on('sort(test)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
  if(obj.field!=null){
	  parm="sort="+obj.field
	  if(obj.type!=null){
		  parm+="&order="+obj.type;
	  }
  }
  table.reload('test', {
    initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
    ,data:getdata(parm)
  });
}); 
//文本框搜索
		  $('.demoTable .layui-btn').on('click', function(){
		    selectall();
		  });
		  
  //渲染表格
 table.render({
	    elem: '#test'
	    ,id: layTableId
	   ,url:'${bathPath}/aDKUserInfo/selectAll.action'
	    ,toolbar: '#toolbarDemo' 
	    ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
	    ,width:730
	    ,size:'sm'
	    ,cols: [[
	    	/* {type: 'checkbox', fixed: 'left',align:'center',width:'5%'} */
			{type: 'numbers',title:'序号', fixed: 'left',align:'center',width:'5%'}
			//,{field: 'autoid',title:'主键', fixed: 'left',align:'center',sort:true,width:'5%'}
	      	,{field: 'userid',title:'人员编号', fixed: 'left',align:'center',width:'15%'}
	      	,{field: 'username',title:'人员名称', fixed: 'left',align:'center',width:'15%'}
	      	,{field: 'depName',title:'部门', fixed: 'left',align:'center',width:'15%'	}
	      	,{field: 'telno',title:'电话', fixed: 'left',align:'center',width:'10%'}
	      	//,{field: 'certnum',title:'证件号码', fixed: 'left',align:'center',sort:true,width:'15%'}
	      	,{field: 'flag',title:'状态', fixed: 'left',align:'center',width:'10%',
	      		templet: function(row){
	      			var ss="";
					if(row.flag==0){
						ss="正常";
					}
					if(row.flag==9){
						ss="注销";
					}
					return ss}}
	      	,{field: 'cardvaliddate',title:'有效期', fixed: 'left',align:'center',width:'15%',edit: 'text'}
	      	,{field: '',title:'操作', fixed: 'left',align:'center',width:'15%',toolbar: '#barDemo'}
	    ]]
	    ,page: true //开启分页
	    ,limit:10  //默认十条数据一页
        ,limits:[10,20,30,40,100]  //数据分页条
	  }); 
});
</script>
    </div>
  </div>
</div>
</body>
</html>